<template>
  <div>
    <a-popconfirm
      title="Are you sure delete this task?"
      ok-text="确定"
      cancel-text="取消"
      @confirm="confirm"
      @cancel="cancel"
      :open="visible"
      @openChange="handleVisibleChange"
      placement="topLeft"
    >
      <template #icon>555</template>
      <a href="#">Delete</a>
      <br>
    </a-popconfirm>
    是否直接执行 <a-checkbox v-model:checked="condition" />
  </div>
</template>

<script>
export default {
  name: '',
  components: {},
  data() {
    return {
      visible: false,
      condition: true,
    }
  },
  created() { },
  mounted() { },
  methods: {
    confirm(e) {
      console.log(e);
      return new Promise(resolve => {
        setTimeout(() => resolve(true), 3000);
      });
    },
    cancel() {

    },
    handleVisibleChange(e) {
      console.log(e, 11);
      console.log(!e, 22);

      if (!e) {
        console.log(3);
        this.visible = false;
        return;
      }
      if (this.condition) {
        confirm(); // next step
      } else {
        this.visible = true;
      }
    }
  },
  computed: {}
}
</script>
<style scoped lang='scss'>
</style>
